<template>
    <div class="box">
        <div class="login_head" >
        <router-link to="/Register" class="head_Register" >注册</router-link>
        </div>
        <div class="login_body" >
            <div class="login_body_login">
                <div class="word">欢迎光临</div>
                <div class="login_input">
                    <el-input placeholder="请输入账号" clearable size="medium" class="input" v-model="account"> </el-input>
                    <el-input placeholder="请输入密码"  show-password size="medium" v-model="password"></el-input>
                </div>
                <div class="login_button">
                    <el-button size="small" round @click="register">注册</el-button>
                    <el-button size="small" round @click="login">登录</el-button>
                </div>
                <div class="touming"></div>
            </div>
        </div>
        <!-- <div class="touming"></div> -->
   
    </div>
</template>
<script>

export default{
    data(){
        return{
            account:"",
            password:"",
            init_number:8,
            session:"",
            sessionData:""
        }
    },
    methods:{
        login(){
            this.$router.push({
                path:'/Index',
                // params:{ first_init:6}
            })
            // } else {
            //     alert("登录失败")
            //     this.account='',
            //     this.password=''
            // }
            this.axios.get('http://192.168.43.171:8081/login', {
                params:{
                 userId: this.account,        // 参数 id
                 psWord: this.password,
                }
         }).then(function (response) {
                 // if (response.data) {
                    //     alert("登陆成功")
                    //     // this.$router.push({ name: 'Index'})

                    // } else {
                    //     alert("登录失败")
                    //     // this.account='',
                    // }
                    console.log(response.data);
                    // window.sessionStorage.setItem('token',response.data.phone)
                  }).catch(function (error) {
                    console.log(error);
                  });
        },          
         register(){
            this.$router.push({ name: 'Register'})
        }

    }
}

</script>
  
<style lang="less">
.box{
    width: 100%;
    height: 100%;
    position: relative;

    .login_head{
        position: fixed;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 40px;
        z-index: 3;
        background-color: rgb(30, 29, 29);
        .head_Register{
            position: absolute;
            top: 10px;
            right: 20px;
            font-size: 10px;
            // color: aliceblue;
            background-color: #fff;
        }
    }
    .login_body{
        z-index: 1;
        position: relative;
        width: 100%;
        height: 100%;
        background-image: url("../assets/01.jpg@1280w_1l_2o_100sh.jpg");
        .login_body_login{
            border-radius: 1opx;
            width: 300px;
            height: 250px;
            position: absolute;
            // padding: 20px;
            top: 50%;
            left: 50%;
            border-radius: 12px;
            z-index: 8;
            // background-color: rgba(255,255,255,0.8);
            // background-color:rgba(245, 243,243, 0.9);
            background-color: #fff;
            border-style:solid;
            border-width: 0.1px;
            border-color: rgba(79, 78, 76,0.3);
            // opacity: 0.9;

            transform: translate(-50%,-50%);
            .word{
                    position: absolute;
                    top: 18px;
                    left: 97px;
                    // opacity: 1.0;
                    font-size: 24px;
                }
            .login_input{
                position: absolute;
                padding: 20px;
                top: 50px;

                // opacity: 1.0;
                .input{
                    margin-bottom: 20px;
                }
            }
            .login_button{
                position: absolute;
                bottom: 30px;
                left: 85px;
                // opacity: 1.0;
            }
        }
    }
   
}
</style>
  